<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>文字的间歇滚动</title>
	<style type="text/css">
		*{
			margin: 0;
			padding: 0;
			box-sizing: border-box;
		}
		html, body {
			width: 100%;
			height: 100%;
		}
		.wrapper {
			width: 400px;
			height: 40px;
			overflow: hidden;
			margin: 100px auto 0;
			border: 1px solid #ccc;
		}
		.wrapper ul{
			list-style: none;
			padding-left: 20px;
		}
		.wrapper li {
			line-height: 30px;
		}
		.wrapper a {
			color: #666;
			text-decoration: none;

		}
		.wrapper a:hover {
			color: red;
		}
	
	</style>
</head>
<body>
	<div class="wrapper" id="wrapper">
		<ul class="scroll-one" id="scroll-content">
			<li><a href="#">我是第1条内容</a></li>
			<li><a href="#">我是第2条内容</a></li>
			<li><a href="#">我是第3条内容</a></li>
			<li><a href="#">我是第4条内容</a></li>
			<li><a href="#">我是第5条内容</a></li>
			<li><a href="#">我是第6条内容</a></li>
			<li><a href="#">我是第7条内容</a></li>
			<li><a href="#">我是第8条内容</a></li>
		</ul>
		<!-- 准备复制 -->
		<!-- <ul class="scroll-one">
			<li><a href="#">我是第一条内容</a></li>
			<li><a href="#">我是第一条内容</a></li>
			<li><a href="#">我是第一条内容</a></li>
			<li><a href="#">我是第一条内容</a></li>
			<li><a href="#">我是第一条内容</a></li>
			<li><a href="#">我是第一条内容</a></li>
			<li><a href="#">我是第一条内容</a></li>
			<li><a href="#">我是第一条内容</a></li>
		</ul> -->
	</div>
	
<script src="js/scrollWord2.js"></script>
</body>
</html>